<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <meta http-equiv="Content-Type" content="multipart/form-data; charset=utf-8" />
    <script src="js/jquery-1.11.1.min.js"></script>
    <script src="js/factory/common.js"></script>

    <form id="uploadPic" action="#" enctype="multipart/form-data">
        <input type="file" name="file">
        <img id="image" src="">
        <a href="javascript:savePic();" class="btn green"> 提交 </a>
    </form>
</head>
<body>
    <script type="text/javascript">

        function test(){
            $.ajax({
                url:"http://140.143.8.95:8080/commodity/searchCommodityList",
                type:"get",
                success:function (data) {
                    alert();
                    console.log(data);
                }
            })
        }
        function savePic(){
            var formData = new FormData($( "#uploadPic" )[0]);
            var ajaxUrl = "http://localhost:8088/djk/image/upload";
            //alert(ajaxUrl);
            //$('#uploadPic').serialize() 无法序列化二进制文件，这里采用formData上传
            //需要浏览器支持：Chrome 7+、Firefox 4+、IE 10+、Opera 12+、Safari 5+。
            $.ajax({
                type: "POST",
                //dataType: "text",
                url: ajaxUrl,
                data: formData,
                async: false,
                cache: false,
                contentType: false,
                processData: false,
                success: function (data) {
                    $("#image").attr("src",imageUrl + data);
                    alert(data);
                },
                error: function(data) {
                    alert("error:"+data.responseText);

                }
            });
            return false;
        }
    </script>
</body>
</html>